<template>
  {{person.name }}
  {{person.age }}
  工作：{{ person.type }}
  {{ person.a.c }}
  <button @click="update">改数据</button>
</template>

<script>
import { reactive, ref } from "vue";
export default {
  name: "App",
  components: {},
  //  setup函数
  setup(props) {
    // 代理对象   -  源对象 
    // reactive 直接点即可
    // ref 要点 value
    let person = reactive({
      name:'zs',
      age:18,
      type: "前端",
      a:{
        c:'hahaha'
      }
    });
   console.log(person);//proxy  对象的代理
    function update() {
      person.name='ls'
      person.age=100
      person.type='ui'
      person.a.c='999'
    }

    return { update, person };
  },
};
</script>

<style>
</style>
